<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
				<title>LingPowerAI</title>
				<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
				<script type="text/javascript">
					document.write('<script src="../../js/fix.js?rd=?rd=' + Math.random() + '"><\/script>');
				</script>
				<script type="text/javascript">
					link(['../../css/reset.css','../../fonts/iconfont/iconfont.css']);
				</script>
				<style type="text/css">
				.mb1rem{
					margin:15px 0px;
				}
				.mui-content{
					background: #FFFFFF;
				}
				body{
					height: 100vh;
				}
					.shareImg{
						background: #FFFFFF;
						z-index: 25;
						height: 100%;
						border-radius: 5px;
						background: #47BAFE;
				      height: 500px;
					}
					.shareImg .img{
						border-radius: 50%;
					border: 1px solid #FFFFFF;
					overflow: hidden;
					background: #FFFFFF;
					width: 80px;
					height: 80px;
					margin: 0 auto;
					line-height: 80px;
					display: flex;
					align-items: center;
					justify-content: center;
					border:.5px solid #EEEEEE;
					
					}
					.shareImg .img img{
						max-width: 100%;
						max-height: 100%;
						vertical-align: middle;
					}
					.mask{
						position: fixed;
						top:0rem;
						left: 0rem;
						width: 100vw;
						background: rgba(0,0,0,0.5);
						height: 100vh;
						z-index: 20;
					}
					.shareImg .name{
						text-align: center;
						font-size: 24px;
					padding: 13px 0rem;
					}
					.shareImg p{
						font-size: 14px;
						text-align: center;
					}
					.codeImg{
						width: 180px;
						margin: 0 auto;
						height: 180px;
						line-height: 180px;
						transform: translateY(-120px);
					}
					.codeImg img{
						max-height: 100%;
					vertical-align: middle;
					max-width: 100%;
					}
					.top{
						padding-top: 40px;
					background: #FFFFFF;
					padding-bottom: 70px;
						/* background-size: 100% 100%; */
					}
					.center{
						height: 50px;
						background: #FFFFFF;
						transform: translateY(-20px);
						border-radius:0px 0px 50% 50%;
						/* background: rgba(0,0,0,0); */
					}
					.footer{
						background: #47BAFE;
						height: 120px;
						position: relative;
					}
					.closeMask{
						position: absolute;
						right: -15px;
						background: #FFFFFF;
						top: -15px;
						border-radius: 50%;
						height: 40px;
						width: 40px;
						text-align: center;
						line-height: 50px;
						box-shadow: 0 0 3px 0px #cdedff;
					}
					.closeMask span{
						font-size: 30px;
					}
					.sharebtn{
						position: absolute;
						bottom: -80px;
						text-align: center;
						width: 100%;
						text-align: right;
						 color: #FFFFFF;
						font-size: 0.16rem;
						height: 80px;
						line-height: 80px;
						font-size: 18px;
						/* background: #FFFFFF; */
						text-align: left;
					}
					.sharebtn img{
						border-radius: 50%;
						width: 40px;
						height: 40px;
						vertical-align: middle;
					}
				</style>
	</head>
	<body>
		 <div class="shareImg"  id="shareImg">
						
		      <div class="top">
						  <div class="img"><img src="../../images/default_pick_photo.png" id="myhead" alt=""></div>
						  <div class="name" id="myname"></div>
						  <p style="font-size: 16px;">我的邀请码：<span id="codenumber"></span></p>
						  	</div>
						  	  <div class="center">
						    </div>
						
							 <div class="footer">
						  <div class="codeImg">
							  <img src="../../images/mine/mycode.png" alt="">
						  </div>
						  <p style="text-align: center; color: #FFFFFF;transform: translateY(-105px);">扫码或长按识别二维码</p>
		              <p style="font-size: 18px;text-align: center; color: #FFFFFF;transform: translateY(-90px);" >每天使用10分钟，展业效率提升200%</p>
		</div>
		</div>
		<script type="text/javascript">
			//必须顺序加载
			script();
		</script>
		<script>
					var shares = null;
			var sweixin = null;
			var wc = null,
				bitmap = null;
			mui.plusReady(function() {
				wc = plus.webview.currentWebview();
				document.getElementById("myname").innerText=wc.name;
				document.getElementById("codenumber").innerText=wc.code;
						// alert(storageUser.ImgUrl);
							 var filename = wc.img.substring(wc.img.lastIndexOf("/") + 1, wc.img.length);  
						var relativePath = "_doc/headimg/" + filename;  
						//判断本地是否存在此图片
						plus.io.resolveLocalFileSystemURL(relativePath , function(entry) {
							//存在就直接设置图片src
							console.log("存在");
								var sd_path = plus.io.convertLocalFileSystemURL(relativePath);  
								document.getElementById("myhead").setAttribute("src",sd_path);
								//转成手机绝对路径
						},function(e){
							console.log("不存在");
								document.getElementById("myhead").setAttribute("src",wc.img);
						})
						
				wc.setStyle({
					height:"500px"
				})
				
				// 将webview内容绘制到Bitmap对象中
				setTimeout(function(){
					console.log(document.getElementById("myhead").getAttribute("src"));
					bitmap = new plus.nativeObj.Bitmap("test");
						wc.draw(bitmap, function() {
						console.log('绘制图片成功');
						download(wc.type);
					}, function(e) {
						console.log('绘制图片失败：' + JSON.stringify(e));
					});
				},500);
		
			})
			
			
			function download(type) {
				bitmap.save("_doc/haibao.jpg", {}, function(i) {
					let webbx = plus.webview.getWebviewById("mine/mine.html")
					mui.fire(webbx, "shareinfo", {
						url: i.target,
						type: type
					});
					console.log('保存图片成功：' + JSON.stringify(i));
					plus.webview.currentWebview().close();
				}, function(e) {
					console.log('保存图片失败：' + JSON.stringify(e));
				});
				// wb.show();
			
			}
		</script>
	</body>

</html>
